function setRem() {
    // 获取当前屏幕宽度
    let screenWidth = document.documentElement.clientWidth || document.body.clientWidth;
    let warpWidth=screenWidth
    // 设置 rem 基准值，1920px 对应 100px
    const baseSize = 16;
    let designWidth = 1920;
    if(screenWidth<768){
        designWidth=1280
    }
    if(screenWidth<520){
        designWidth=750
    }
    // 计算当前屏幕下的 font-size
    const remSize = (warpWidth / designWidth) * baseSize;
    document.documentElement.style.fontSize = remSize + 'px';
}

// 初始设置 rem
setRem();

// 当窗口大小改变时重新计算 rem
window.addEventListener('resize', setRem);
// $( "#target-1" ).HappyImage({
//     effect: "slide"
// });

// 判断用户是否登录，如果登录，显示登录头像，否者显示登录按钮
function isLogin(){
    let isLogin=localStorage.getItem('PAGE_TOKEN')
    // let isLogin=1
    if(isLogin){
        $('.navigation .login_none').hide()
        $('.navigation .login_adready').show()
    }else{
        $('.navigation .login_none').show()
        $('.navigation .login_adready').hide()
    }
}

// vip会员弹窗
function appendVip(){
    let isMember=location.href.indexOf('member')>-1?true:false
    let dialogHtml=`
        <div class="vip_dialog">
			<div class="mask"></div>
			<div class="inner">
				<div class="vip_head">
					<div class="vip_info">
						<img src="${(isMember?'..':'.')+'/img/all_tou.png'}" alt="" class="vip_head_img">
						<span class="vip_name">再吃一口</span>
						<span class="user_tab">暂未开通</span>
					</div>
					<ul class="vip_btns">
						<li class="btn_act">普通会员</li>
						<li>VIP</li>
						<li>SVIP</li>
					</ul>
				</div>
				<div class="vip_body">
					<div class="vb_left">
						 <div class="vbl_top">
							<img src="${(isMember?'..':'.')+'/img/member/user_vips_icon.png'}" alt="">
							<p>普通会员</p>
						 </div>
                         <div class="vbl_bot">
                            <p class="vbl_tit">会员权益</p>
                            <ul class="vbl_list">
                                <li>浏览查看所有咨询、洞见内容</li>
                                <li>点赞</li>
                                <li>可成果与任务等内容</li>
                            </ul>
                         </div>
						
					</div>
					<div class="vb_right">
						<p class="vbr_tit">购买时长</p>
						<ul class="vbr_list">
							<li class="vbrl_act">
								<p class="name">普通会员1年</p>
								<p class="price"><i>¥</i>59</p>
								<p class="desc">仅4.9元/每月</p>
							</li>
							<li>
								<p class="name">普通会员1年</p>
								<p class="price"><i>¥</i>59</p>
								<p class="desc">仅4.9元/每月</p>
							</li>
							<li>
								<p class="name">普通会员1年</p>
								<p class="price"><i>¥</i>59</p>
								<p class="desc">仅4.9元/每月</p>
							</li>
						</ul>
						<p class="vbr_tit">付款</p>
						<div class="vbr_pay">
							<img src="${(isMember?'..':'.')+'/img/member/ewm.png'}" alt="" class="ewm_icon">
							<div class="vbrp_right">
								<p>应付金额： <span class="price"> ¥</i>59</span></p>
								<p class="vbrp_method"><i class="wecaht_icon"></i> 使用微信扫码支付</p>
								<p>支付即视为您同意《歌必网会员服务协议》和《歌必网会员授权许可协议》</p>
							</div>
						</div>
					</div>
				</div>
				<div class="dialog_close"></div>
			</div>
		</div>
    `
    // 判断页面是否有vip弹窗元素
    if($('body .vip_dialog').length!=0){
        $('body .vip_dialog').css('display','flex')
    }else{
        $('body').append(dialogHtml)
        $('body .vip_dialog').css('display','flex')
    }
}
// 等待加载完成之后再执行下列操作
window.onload=function(){
	$('.navigation .infos .rihts .imgs').on('click', function() {
		console.log('点击了搜索')
		
		if (window.location.href.includes("member")) {
		  window.location.href = '../search.html';
		  // 可以在这里添加相关逻辑
		} else {
		  window.location.href = './search.html';
		}
	})
    // 点击顶部更多菜单栏切换效果
    $('.navigation').on('click','.more',function(){
        if($(this).hasClass('icon-gengduo')){
            $('.navigation .nav_list').css('right','0')
            $(this).removeClass('icon-gengduo').addClass('icon-closel')
			$('.nav_list .none').css('color', '#000');
			$('.tops').css('display', 'none');
			$('.navigation').css('background', '#fff');
			$('.infos .rihts .more').css('color', '#000');
			$('.infos .rihts .imgs').css('display', 'none');
			
        }else if($(this).hasClass('icon-closel')){
            $('.navigation .nav_list').css('right','-100%')
			$('.nav_list .none').css('color', '#fff');
            $(this).removeClass('icon-closel').addClass('icon-gengduo')
			$('.tops').css('display', 'block');
			$('.navigation').css('background', 'rgba(0,0,0,0)');
			$('.infos .rihts .more').css('color', 'inherit');
			$('.infos .rihts .imgs').css('display', 'block');
        }
    })
    // 执行判断用户是否登录
    isLogin()
    // 退出登录
    $('.login_info').on('click','.login_out',function(e){
        e.stopPropagation();
        localStorage.removeItem('PAGE_TOKEN')
        let isMember=location.href.indexOf('member')>-1?true:false
        location.href=(isMember?'../':'.')+'/index.html'
    })
    // 打开vip中心
    $('.login_info').on('click','.vip_btn',function(e){
         console.log(5);
        e.stopPropagation();
        appendVip()
    })
    // 点击关闭按钮 关闭会员弹窗
    $('body').on('click','.vip_dialog .dialog_close',function(){
        $('body .vip_dialog').hide()
    })
    // 点击会员类型切换
    $('body ').on('click','.vip_dialog .vip_btns li',function(){
        $(this).addClass('btn_act').siblings().removeClass('btn_act')
        $('body .vip_dialog .vbl_top p').text($(this).text())
    })
    // 点击购买时长切换
    $('body ').on('click','.vip_dialog .vbr_list li',function(){
        $(this).addClass('vbrl_act').siblings().removeClass('vbrl_act')
    })
    // 编辑修改地址设定为默认地址按钮
    $('.address_dialog').on('click','.address_set',function(){
        if($(this).find('.check-icon').hasClass('check-have')){
            $(this).find('.check-icon').removeClass('check-have').addClass('check-none')
        }else{
            $(this).find('.check-icon').removeClass('check-none').addClass('check-have')
        }
     })
    let prod=['四川省','云南省','贵州省','海南省','甘肃省','浙江省','山西省','河北省']
    let city=['成都市','广元市','攀枝花市','简阳市','达州市','巴中市','南充市','遂宁市']
    let county=['武侯区','金牛区','双流区','新都区','郫都区']
    // 打开地区选择
     $('.address_dialog').on('click','.select_context',function(){
        if($(this).find('.iconfont').hasClass('down')){
            $(this).find('.iconfont').css('transform','rotate(0deg)').removeClass('down')
            $(this).siblings('.select_dialog').hide()
       }else{
            $(this).find('.iconfont').css('transform','rotate(180deg)').addClass('down')
            $(this).siblings('.select_dialog').show()
       }
     })
     $('.address_dialog').on('click','.tab_list li',function(){
        let index= $(this).index()
        $(this).addClass('tab_act').siblings().removeClass('tab_act')
        let arr=[]
         let listHtml=''
        if(index==0){
            arr=prod
        }else if(index==1){
            arr=city
        }else{
            arr=county
        }
        for(let i=0;i<arr.length;i++){
            listHtml+=`<li>${arr[i]}</li>`
         }
         $('.address_dialog .select_list').html(listHtml)

     })
     // 选择省市区
     $('.address_dialog').on('click','.select_list li',function(){
        let index= $('.address_dialog .tab_list .tab_act').index()
        let listHtml=''
        if(index==0){
            $('.address_dialog .tab_list li').eq(1).show().addClass('tab_act').siblings().removeClass('tab_act')
             for(let i=0;i<city.length;i++){
                listHtml+=`<li>${city[i]}</li>`
             }
             $('.address_dialog .select_list').html(listHtml)
             $('.address_dialog .select_context span').text($(this).text())
             $('.address_dialog .tab_list li').eq(0).text($(this).text())
             $('.address_dialog .tab_list li').eq(1).text('请选择')
             $('.address_dialog .tab_list li').eq(2).text('请选择')
        }else if(index==1){
            $('.address_dialog .tab_list li').eq(2).show().addClass('tab_act').siblings().removeClass('tab_act')
             for(let i=0;i<county.length;i++){
                listHtml+=` <li>${county[i]}</li>`
             }
             $('.address_dialog .select_list').html(listHtml)
            let text=$('.address_dialog .select_context span').text()
            let arr= text.split('/')
            let resultTxt=''
            if(arr.length>1){
                arr[1]=$(this).text()
                arr.length>2?arr.splice(2,1):arr
                console.log(arr,567);
                
                resultTxt=arr.join('/')
            }else{
                resultTxt=text+'/'+$(this).text()
            }
             $('.address_dialog .select_context span').text(resultTxt)
             $('.address_dialog  .tab_list li').eq(1).text($(this).text())
             $('.address_dialog .tab_list li').eq(2).text('请选择')
        }else if(index==2){
            let text=$('.address_dialog .select_context span').text()
            let arr= text.split('/')
            let resultTxt=''
            if(arr.length>2){
                arr[2]=$(this).text()
                resultTxt=arr.join('/')
            }else{
                resultTxt=text+'/'+$(this).text()
            }
             $('.address_dialog .select_context span').text(resultTxt)
             $('.address_dialog .tab_list li').eq(2).text($(this).text())
             $('.address_dialog .select_dialog').hide()
             $('.address_dialog .select_context').find('.iconfont').css('transform','rotate(0deg)').removeClass('down')
             
            //  for(let i=0;i<prod.length;i++){
            //     listHtml+=` <li>${prod[i]}</li>`
            //  }
            //  $('.address_dialog .select_list').html(listHtml)
        }

     })
}

